<template>
	<kui-page bg-color="#FFFFFF" :custom-header="false">
		<template v-slot:body>
			<kui-space :gap="[30,0]" direction="column">
				<kui-cell-group title="基本用法">
					<kui-divider></kui-divider>
				</kui-cell-group>
				<kui-cell-group title="虚线">
					<kui-divider dashed></kui-divider>
				</kui-cell-group>
				<kui-cell-group title="缩进">
					<kui-divider inset="100rpx"></kui-divider>
					<kui-divider inset="60rpx" margin="64rpx 0"></kui-divider>
					<kui-divider inset="100rpx" inset-direction="end" margin="64rpx 0"></kui-divider>
				</kui-cell-group>
				<kui-cell-group title="垂直分割线">
					<view class="kui-flex kui-justify-center kui-items-center kui-h-full">
						<kui-text>文本</kui-text>
						<kui-divider direction="column"></kui-divider>
						<kui-text>文本</kui-text>
						<kui-divider direction="column"></kui-divider>
						<kui-text>文本</kui-text>
					</view>
				</kui-cell-group>
				<kui-cell-group title="带内容描述的分割线">
					<kui-divider>
						<kui-text>文本描述</kui-text>
					</kui-divider>
				</kui-cell-group>
				<kui-cell-group title="描述文本位置">
					<view class="kui-mb-5">
						<kui-divider text-position="left">
							<kui-text>文本描述</kui-text>
						</kui-divider>
					</view>
					<view class="kui-mb-5">
						<kui-divider text-position="center">
							<kui-text>文本描述</kui-text>
						</kui-divider>
					</view>
					<view class="kui-mb-5">
						<kui-divider text-position="right">
							<kui-text>文本描述</kui-text>
						</kui-divider>
					</view>
				</kui-cell-group>
				<kui-cell-group title="最小像素边框">
					<kui-divider min-px margin="32rpx 0"></kui-divider>
				</kui-cell-group>
				<kui-cell-group title="自定义颜色和主题">
					<view class="kui-mb-5">
						<kui-divider color="orange">
							<kui-text>自定义颜色</kui-text>
						</kui-divider>
					</view>
					<view class="kui-mb-5">
						<kui-divider theme="lime">
							<kui-text>自定义主题</kui-text>
						</kui-divider>
					</view>
				</kui-cell-group>
				<kui-cell-group title="非文本内容">
					<kui-divider>
						<kui-icons type="heart" theme="danger"></kui-icons>
					</kui-divider>
				</kui-cell-group>
			</kui-space>
		</template>
	</kui-page>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>

</style>
